{% extends "base.html" %}

{% block title %}{{ block.super }} &bull; Sections for Spec {{ spec.label }} {% endblock %}

{% block extrahead %}
{# <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script> #}
{# locally modified jquery with bfcache hack #}
<script src="{{ MEDIA_URL }}/js/jquery-1.2.6.js" type="text/javascript"></script>

<script type="text/javascript">
$(function() {
    $("a.show-hide-tests").click(function(event) {
        $(this).parent().next().toggle();
        event.preventDefault();
    });
    $("a.show-empty-sections").click(function(event) {
        $("#section-list").removeClass("hide-empty-sections");
        event.preventDefault();
    });
    $("a.hide-empty-sections").click(function(event) {
        $("#section-list").addClass("hide-empty-sections");
        event.preventDefault();
    });
    $("a.show-tests").click(function(event) {
        $(".tests-table").show();
        event.preventDefault();
    });
    $("a.hide-tests").click(function(event) {
        $(".tests-table").hide();
        event.preventDefault();
    });
});
</script>
{% endblock %}

{% block content %}

<h2>{{ spec.label }}</h2>

<div class="show-hide-links">
    <a href="#" class="show-empty-sections">Show sections with no tests</a>
    <a href="#" class="hide-empty-sections">Hide sections with no tests</a>
    <a href="#" class="show-tests">Expand all tests</a>
    <a href="#" class="hide-tests">Collapse all tests</a>
</div>

{% load testtags %}

<ul id="section-list" class="hide-empty-sections">
{% for section in spec.section_set_with_count.all %}
    <li class="{% ifequal section.test__count 0 %}empty-section{% endifequal %}">
        <div class="section">
            <div class="section-number">{{ section.number }}</div>
            <span class="section-label">{{ section.label }}</span>
        </div>
        <div class="tests-container">
            <div>
                {{ section.test__count }} test{{ section.test__count|pluralize }}.
                <a href='#' class='show-hide-tests'>show/hide</a>
            </div>
            {% ifnotequal section.test__count 0 %}
                {% show_tests section.test_set.select_related.all %}
            {% endifnotequal %}
        </div>
    </li>
{% endfor %}
</ul>

{% endblock %}
